<template>
	<div>
	<!-- 头部 -->
	<div class="topBar">
		<span>&#10052 30天无理由退货</span>
		<span> &#10052 48小时快速退款</span>
		<span> &#10052 满88元免邮费</span>
	</div>
	<!-- 商品展示区 -->
	<div class="goods" v-for="item in list" :key="item.id">
		
		
		<!-- <div class="goods-num">x{{}}</div> -->
		<van-swipe-cell  class="remove">
			<van-cell :border="false" />
		<van-checkbox v-model="checked">复选框</van-checkbox>
		<img :src="item.list_pic_url" alt="" style="width: 100px; height: 100px;">
		<div class="goods-text" >
			<span class="goods-text1"></span>
			<p class="goods-text2"></p>
			
			
		</div>
		<template #right >
		  <van-button square type="danger" text="删除"  class="button-remove" />
		</template>
		</van-swipe-cell> 
	</div>
	<!-- 隔断 -->
	<!-- <van-swipe-cell  class="remove">
	  <van-cell :border="false" />
		
	  
	  <template #right >
	    <van-button square type="danger" text="删除"  class="button-remove" />
	  </template>
	</van-swipe-cell> -->
		<!-- 尾巴标签 -->
	</div>
</template>

<script>
	import{
		cartList,
		deleteAction,
		addCart
	} from "../../api/cart/index.js"
	
	export default{
		data(){
			return{
				list:[],
				checked: true,
			}
		},
		methods:{
			async init(){
				//获取购物车列表
				var res = await cartList({
					openId:localStorage.getItem("openId")
				})
				console.log(res)
				this.list = res.data.data
			}
		},
		created(){
			this.init()
		},
	}
</script>

<style scoped lang="scss" >
	@import "./scss/index.scss";
	// 头部
	.topBar{
		width: 100%;
		height: 50px;
		background-color: #F4F4F4;
		display: flex;
		justify-content: space-between;
		span{
			line-height: 50px;
			color: #666;
		}
		
	}
	//商品列表
	.remove{
		width: 100%;
		height: 100px;
		.button-remove{
			height: 100px;
		}
	}
</style>
